<template>
  <view class="container">
    <view class="card">
      <text class="title">注册</text>
      <view class="form-group">
        <text class="label">请输入用户名</text>
        <input type="text" v-model="name" placeholder="用户名" class="input" />
      </view>
	  <view class="form-group">
	    <text class="label">请输入电话号码</text>
	    <input type="tel" v-model="tel" placeholder="电话号码" class="input" />
	  </view>
	  <view class="form-group">
	    <text class="label">请输入email</text>
	    <input type="email" v-model="email" placeholder="邮箱" class="input" />
	  </view>
      <view class="form-group">
        <text class="label">请输入密码</text>
        <input type="password" v-model="password" placeholder="密码" class="input" />
      </view>
      <view class="form-group">
        <text class="label">请确认密码</text>
        <input type="password" v-model="repassword" placeholder="确认密码" class="input" />
      </view>
      <button class="btn" @click="handleRegister">注册</button>
      <navigator url="/pages/login/login" class="link">已有账号？去登录</navigator>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      name: '',
      password: '',
      repassword: '',
	  tel:'',
	  email:''
    };
  },
  methods: {
	  
    handleRegister() {
      if (!this.name) {
        uni.showToast({ title: '请输入用户名', icon: 'none' });
        return;
      }
      if (!this.password) {
        uni.showToast({ title: '请输入密码', icon: 'none' });
        return;
      }
      if (this.password !== this.repassword) {
        uni.showToast({ title: '两次密码不一致', icon: 'none' });
        return;
      }
	  const telReg = /^1[3-9]\d{9}$/;
	  	  if (!this.tel) {
	  	    uni.showToast({ title: '请输入电话号码', icon: 'none' });
	  	    return;
	  	  }
	  	  if (!telReg.test(this.tel)) {
	  	    uni.showToast({ title: '电话号码格式错误', icon: 'none' });
	  	    return;
	  	  }
	  	  // 新增：邮箱格式校验
	  	  const emailReg = /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/;
	  	  if (!this.email) {
	  	    uni.showToast({ title: '请输入邮箱', icon: 'none' });
	  	    return;
	  	  }
	  	  if (!emailReg.test(this.email)) {
	  	    uni.showToast({ title: '邮箱格式错误', icon: 'none' });
	  	    return;
	  	  }
	  uniCloud.callFunction({
	  	name:'addUser',
		data:{
			'name':this.name,
			'password':this.password,
			'tel':this.tel,
			'email':this.email
		},
	  })
      // 实际项目中可对接后端接口，这里仅做示例提示
      uni.showToast({ title: `注册成功！用户名：${this.name}`, icon: 'success' });
	  uni.navigateTo({
	  	url:'/pages/login/login'
	  });
    }
  }
};
</script>

<style scoped>
/* 样式与登录页基本一致，可复用 */
.container {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  background-color: #f0f2f5;
  padding: 20px;
}
.card {
  background-color: #fff;
  padding: 30px;
  border-radius: 8px;
  box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1);
  width: 90%;
  max-width: 350px;
}
.title {
  display: block;
  text-align: center;
  font-size: 24px;
  font-weight: bold;
  color: #333;
  margin-bottom: 25px;
}
.form-group {
  margin-bottom: 20px;
}
.label {
  display: block;
  margin-bottom: 8px;
  color: #666;
  font-size: 14px;
}
.input {
  width: 90%;
  padding: 12px;
  border: 1px solid #ddd;
  border-radius: 4px;
  font-size: 16px;
}
.btn {
  width: 100%;
  padding: 12px;
  background-color: #1677ff;
  color: #fff;
  border-radius: 4px;
  font-size: 16px;
  margin-top: 10px;
}
.link {
  display: block;
  text-align: center;
  margin-top: 15px;
  font-size: 14px;
  color: #1677ff;
  text-decoration: none;
}
</style>